<template>
	<view>
		<view class="flex_b p-30" style="flex-wrap: wrap;">
			<block v-if="lookme.length">
				<view v-for="(item,index) in lookme" :key="index" class="flex_b" style="padding: 20rpx 10rpx;width: 710rpx;" @click="likeDetali(item)">
					<view class="VisitorItemBox flex">
						<view class="VisitorItemBoxImg m-r-20">
							<image :src="item.avatar" mode="" :class="userInfo.level>1?'':'mohuBox'"></image>
						</view>
						<view class="">
							<view class="font-weight">{{item.nickname||'微信用户'}}</view>
							<view class="font-24 f-t">访问{{item.num||1}}次</view>
						</view>
					</view>
					<view class="lookBox">立即查看</view>
				</view>
			</block>
			<block v-else>
				<noneList></noneList>
			</block>
			<noneVip ref="popup" id="myChild"></noneVip>
			<view class="bottom-mar"></view>
		</view>
		
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				lookme:[],
				userInfo:{}
			};
		},
		onLoad() {
			this.lookMeFn()
			this.getUserInfo()
		},
		methods:{
			// 获取用户信息
			getUserInfo() {
				this.$api.sendRequest({
					url: '/api/user/userInfo',
					success: res => {
						this.userInfo = res.data
					}
				})
			},
			
			lookMeFn() {
				this.$api.sendRequest({
					url:'/api/User/lookme',
					data:{
						limit:10,
						page:1
					},success:res=>{
						this.lookme = res.data.data
					}
				})
			},
			likeDetali(item) {
				if(this.userInfo.level>1) {
					this.$util.redirectTo('/otherpages/userDetali/userDetali',{id:item.id})
				}else {
					const childComponent = this.selectComponent('#myChild');
					childComponent.$vm.openFn();
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.VisitorItemBox {
		.VisitorItemBoxImg {
			width: 96rpx;
			height: 96rpx;
			// filter: blur(4px);
			border-radius: 50%;
			/* 第一步：让文字强制一行显示 */
			white-space: nowrap;
			/* 第二步：溢出隐藏 */
			overflow: hidden;
			/* 第三步：溢出的内容省略号显示 */
			text-overflow: ellipsis;

			image {
				width: 96rpx;
				height: 96rpx;
				border-radius: 50%;
			}
		}
	}
	.mohuBox {
		filter: blur(4px);
	}
	.lookBox {
		width: 140rpx;
		height: 60rpx;
		background: #F5BE85;
		border-radius: 32rpx;
		font-size: 24rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 600;
		color: #95603F;
		line-height: 60rpx;
		text-align: center;
	}
</style>
